<template>
<div>
    <!-- 顶部区域 -->
	<div id="top_bg">
		<div id="top">
			<span class="hi">*{{uname}}*欢迎光临哎哩啵啵!</span>
			<span class="login_reg">[ <router-link to="/login">登录</router-link> | <router-link to="/register">免费注册</router-link> ]</span>
			<a href="#" class="top_a">为您推荐</a>
			<a href="#" class="top_a">我的订单</a>
			<a href="#" class="top_a">加入我们</a>

			<!-- 顶部右侧 -->
			<ul id="top_right">
				<li class="li_r tel">400-600-6888</li>
				<!-- <li class="li_r shoujifanke"></li> -->
				<li class="li_r en"><a href="#">English</a></li>
				<li class="li_r has_hide">
					<a href="#" class="menu_a">帮助中心</a>	
					<div class="hide_box">
						<ul class="hide_ul">
							<li><a href="#">购物指南</a></li>
							<li><a href="#">配送方式</a></li>
							<li><a href="#">支付方式</a></li>
							<li><a href="#">售后服务</a></li>
							<li><a href="#">投诉建议</a></li>
							<li><a href="#">客服问答</a></li>
						</ul>
						<div class="bottom"></div>
					</div>
				</li>
				<li class="li_r has_hide">
					<a href="#" class="menu_a">网站导航</a>
					<div class="hide_box">
						<ul class="hide_ul">
							<li><a href="#">网站联盟</a></li>
							<li><a href="#">啵啵社区</a></li>
							<li><a href="#">啵啵微博</a></li>
							<li><a href="#">会员独享</a></li>
							<li><a href="#">合作专区</a></li>
							<li><a href="#">礼品卡</a></li>
							<li><a href="#">资讯中心</a></li>
							<li><a href="#">企业服务</a></li>
						</ul>
						<div class="bottom"></div>
					</div>
				</li>
				<li class="li_r has_hide">
					<a href="#" class="menu_a">我的啵啵</a>
					<div class="hide_box" style="background:red;">
						<ul class="hide_ul">
							<li><a href="#">我的订单</a></li>
							<li><a href="#">我的收藏</a></li>
							<li><a href="#">积分查询</a></li>
						</ul>
						<div class="bottom"></div>
					</div>

				</li>
			</ul>
			<!-- 顶部右侧结束 -->
		</div>
	</div>
	<!-- 顶部区域结束 -->
        <!-- 主体区域 -->
    <div id="main">
        <!-- logo+搜索等内容的区域 --> 
	<div id="logo_box">
		<div id="logo">哎哩啵啵</div>
		<ul id="on_search">
			<li>啵啵精品</li>
			<li class="no_bg">V+商城</li>
		</ul>
		<!-- 搜索框 -->
		<form action="" id="search">
			<input type="text" class="con" />
			<input type="submit" class="sub" value="" />
		</form>
		<!-- 搜索框结束 -->

		<p id="tags">
			<a href="#">T恤</a>
			<a href="#">帆布鞋</a>
			<a href="#">衬衫</a>
			<a href="#">针织裤</a>
			<a href="#">POLO衫</a>
			<a href="#">耐克</a>
			<a href="#">阿迪达斯</a>
		</p>

		<!-- 购物车 -->
		<div id="gouwuche">
			<a href="#" class="num">购物车<span>0</span>件</a>
			<div class="hide_box">
				<p>您的购物车中没有任何商品</p>
			</div>
		</div>
		<!-- 购物车结束 -->
		<a href="#" id="fankedaren">啵啵达人</a>
		<div id="fankeqixia_box" class="m2">
			<div class="fankeqixia">
				啵啵旗下
			</div>
			<div class="hide_box">
				<div class="top"></div>
				<div class="middle">
					<ul class="right">
						<li><a href="#">俏丽春装秀</a></li>
						<li><a href="#">美妆精品汇</a></li>
						<li><a href="#">春鞋抢鲜购</a></li>
						<li><a href="#">数码新生活</a></li>
						<li><a href="#">时尚运动风</a></li>
						<li><a href="#">居家日用品</a></li>
					</ul>
					<div class="left">
						<p class="title">潮流服饰</p>
						<ul class="list">
							<li>
								<a href="#" class="first_a">时尚男装</a>
								<a href="#">针织衫</a>
								<a href="#">外套</a>
								<a href="#">衬衫</a>
								<a href="#">牛仔裤</a>
								<a href="#">内裤</a>
								<a href="#" class="last_a">佐丹奴</a>
							</li>
							<li>
								<a href="#" class="first_a">魅力女装</a>
								<a href="#">连衣裙</a>
								<a href="#">针织衫</a>
								<a href="#">风衣</a>
								<a href="#">裤装</a>
								<a href="#">文胸</a>
								<a href="#" class="last_a">韩都衣舍</a>
							</li>
							<li>
								<a href="#" class="first_a">运动休闲</a>
								<a href="#">运动鞋</a>
								<a href="#">运动服</a>
								<a href="#">瑜伽服</a>
								<a href="#">速干衣</a>
								<a href="#">户外鞋</a>
								<a href="#" class="last_a">安踏</a>
							</li>
							<li>
								<a href="#" class="first_a">可爱童装</a>
								<a href="#">童装</a>
								<a href="#">童鞋</a>
								<a href="#">亲子装</a>
								<a href="#">孕妇装</a>
								<a href="#">绿盒子</a>
								<a href="#" class="last_a">笛莎</a>
							</li>
						</ul>
					</div>
					<div class="left">
						<p class="title">潮流服饰</p>
						<ul class="list">
							<li>
								<a href="#" class="first_a">时尚男装</a>
								<a href="#">针织衫</a>
								<a href="#">外套</a>
								<a href="#">衬衫</a>
								<a href="#">牛仔裤</a>
								<a href="#">内裤</a>
								<a href="#" class="last_a">佐丹奴</a>
							</li>
							<li>
								<a href="#" class="first_a">魅力女装</a>
								<a href="#">连衣裙</a>
								<a href="#">针织衫</a>
								<a href="#">风衣</a>
								<a href="#">裤装</a>
								<a href="#">文胸</a>
								<a href="#" class="last_a">韩都衣舍</a>
							</li>
							<li>
								<a href="#" class="first_a">运动休闲</a>
								<a href="#">运动鞋</a>
								<a href="#">运动服</a>
								<a href="#">瑜伽服</a>
								<a href="#">速干衣</a>
								<a href="#">户外鞋</a>
								<a href="#" class="last_a">安踏</a>
							</li>
							<li>
								<a href="#" class="first_a">可爱童装</a>
								<a href="#">童装</a>
								<a href="#">童鞋</a>
								<a href="#">亲子装</a>
								<a href="#">孕妇装</a>
								<a href="#">绿盒子</a>
								<a href="#" class="last_a">笛莎</a>
							</li>
						</ul>
					</div>
					<div class="left">
						<p class="title">潮流服饰</p>
						<ul class="list">
							<li>
								<a href="#" class="first_a">时尚男装</a>
								<a href="#">针织衫</a>
								<a href="#">外套</a>
								<a href="#">衬衫</a>
								<a href="#">牛仔裤</a>
								<a href="#">内裤</a>
								<a href="#" class="last_a">佐丹奴</a>
							</li>
							<li>
								<a href="#" class="first_a">魅力女装</a>
								<a href="#">连衣裙</a>
								<a href="#">针织衫</a>
								<a href="#">风衣</a>
								<a href="#">裤装</a>
								<a href="#">文胸</a>
								<a href="#" class="last_a">韩都衣舍</a>
							</li>
							<li>
								<a href="#" class="first_a">运动休闲</a>
								<a href="#">运动鞋</a>
								<a href="#">运动服</a>
								<a href="#">瑜伽服</a>
								<a href="#">速干衣</a>
								<a href="#">户外鞋</a>
								<a href="#" class="last_a">安踏</a>
							</li>
							<li>
								<a href="#" class="first_a">可爱童装</a>
								<a href="#">童装</a>
								<a href="#">童鞋</a>
								<a href="#">亲子装</a>
								<a href="#">孕妇装</a>
								<a href="#">绿盒子</a>
								<a href="#" class="last_a">笛莎</a>
							</li>
						</ul>
					</div>
					<div class="left">
						<p class="title">潮流服饰</p>
						<ul class="list">
							<li>
								<a href="#" class="first_a">时尚男装</a>
								<a href="#">针织衫</a>
								<a href="#">外套</a>
								<a href="#">衬衫</a>
								<a href="#">牛仔裤</a>
								<a href="#">内裤</a>
								<a href="#" class="last_a">佐丹奴</a>
							</li>
							<li>
								<a href="#" class="first_a">魅力女装</a>
								<a href="#">连衣裙</a>
								<a href="#">针织衫</a>
								<a href="#">风衣</a>
								<a href="#">裤装</a>
								<a href="#">文胸</a>
								<a href="#" class="last_a">韩都衣舍</a>
							</li>
							<li>
								<a href="#" class="first_a">运动休闲</a>
								<a href="#">运动鞋</a>
								<a href="#">运动服</a>
								<a href="#">瑜伽服</a>
								<a href="#">速干衣</a>
								<a href="#">户外鞋</a>
								<a href="#" class="last_a">安踏</a>
							</li>
							<li>
								<a href="#" class="first_a">可爱童装</a>
								<a href="#">童装</a>
								<a href="#">童鞋</a>
								<a href="#">亲子装</a>
								<a href="#">孕妇装</a>
								<a href="#">绿盒子</a>
								<a href="#" class="last_a">笛莎</a>
							</li>
						</ul>
					</div>
					
				</div>
				<div class="bottom"></div>
			</div>
		</div>
	</div>
	<!-- logo+搜索等内容的区域结束 -->    
    <!-- 红色导航区域 -->
	<div id="menu_box">
		<ul>
			<li><a href="#">首页</a></li>
			<li>
				<a href="#">T恤</a>
				<div class="new_ico"></div>
			</li>
			<li><a href="#">帆布鞋</a></li>
			<li><a href="#">衬衫</a></li>
			<li><a href="#">POLO衫</a></li>
			<li><a href="#">休闲裤</a></li>
			<li><a href="#">休闲鞋</a></li>
			<li><a href="#">裙子</a></li>
			<li><a href="#">袜子</a></li>
			<li><a href="#">NBA</a></li>
			<li>
				<a href="#">短裤</a>
				<div class="hot_ico"></div>
			</li>
			<li><a href="#">牛仔</a></li>
			<li><a href="#">针织裤</a></li>
			<li><a href="#">休闲包</a></li>
			<li><a href="#">运动鞋</a></li>
			<li><a href="#">优鲨</a></li>
			<li><a href="#">Justyle</a></li>
		</ul>

		<a href="#" class="xianshitemai"></a>
	</div>
	<!-- 红色导航区域结束 -->
     <!-- 灰色导航区域 -->

        <!-- 灰色导航区域结束 -->
    <!-- ad1广告图片区域 -->
	<img :src="img.adi1" alt="" id="ad1" />
	<!-- ad1广告图片区域结束 -->
    <!-- 图片轮换板区域 -->
	<div id="flash_box">
		<table class="left">
			<tr>
				<td colspan="4"><img :src="box_left.left1" alt="" /></td>
			</tr>
			<tr>
				<td><img :src="box_left.left2" alt="" /></td>
				<td><img :src="box_left.left3" alt="" /></td>
				<td><img :src="box_left.left4" alt="" /></td>
				<td><img :src="box_left.left5" alt="" /></td>
			</tr>
		</table>

		<!-- 图片轮换板 -->
		<div class="flash">
			<img :src="flash.flash1" style="display:block;" />
			<img :src="flash.flash2" alt="" />
			<img :src="flash.flash3" alt="" />
			<img :src="flash.flash4" alt="" />
			<img :src="flash.flash5" alt="" />
			<img :src="flash.flash6" alt="" />
			<img :src="flash.flash7" alt="" />
			<ul>
				<li class="cur">1</li>
				<li>2</li>
				<li>3</li>
				<li>4</li>
				<li>5</li>
				<li>6</li>
				<li>7</li>
			</ul>
		</div>
		<!-- 图片轮换板结束 -->

		<!-- 无缝轮播区域 -->
		<div class="wufeng">
			<div class="wufeng_left"></div>
			<div class="wufeng_right">
				<ul class="list1">
					<li><a href="#">礼品卡购物折上折</a></li>
					<li><a href="#">微信关注有礼，凡客诚品官方商城</a></li>
					<li><a href="#">新款休闲包9元起</a></li>
					<li><a href="#">新款休闲包9元起</a></li>
					<li><a href="#">明星款幻彩丝柔连裤袜10元起</a></li>
					<li><a href="#">休闲短袖衬衫 新品上市 79元起</a></li>
				</ul>
				<ul class="list2">
					<li><a href="#">礼品卡购物折上折</a></li>
					<li><a href="#">微信关注有礼，凡客诚品官方商城</a></li>
					<li><a href="#">新款休闲包9元起</a></li>
					<li><a href="#">新款休闲包9元起</a></li>
					<li><a href="#">明星款幻彩丝柔连裤袜10元起</a></li>
					<li><a href="#">休闲短袖衬衫 新品上市 79元起</a></li>
				</ul>
			</div>
		</div>
		<!-- 无缝轮播区域结束 -->
	</div>
	<!-- 图片轮换板区域结束 -->
<!-- 所有商品分类区域 -->
	<div id="fenlei_box">
		<!-- 左侧 -->
		<div class="title">
			<ul>
				<li><a href="#">到货通知</a></li>
				<li><a href="#">热销排行</a></li>
				<li>
					<a href="#">特价专区</a>
					<div class="hot_ico"></div>
				</li>
			</ul>
		</div>

		<div class="fenlei_list">
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>

			<div class="list">
				<div class="left">
					<p>运动</p>
				</div>
				<div class="right">
					<p>
						<a href="#">阿迪达斯</a>
						<a href="#">耐克</a>
						<a href="#">匡威</a>
						<a href="#">彪马</a>
						<a href="#" class="last">范斯</a>
					</p>
					<p>
						<a href="#">NB</a>
						<a href="#">特步</a>
						<a href="#">乔丹</a>
						<a href="#">安踏</a>
						<a href="#" class="last">李宁</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>美妆</p>
				</div>
				<div class="right">
					<p>
						<a href="#">底妆</a>
						<a href="#">眼影</a>
						<a href="#">高光</a>
						<a href="#">腮红</a>
						<a href="#" class="last">眼线</a>
					</p>
					<p>
						<a href="#">遮瑕</a>
						<a href="#">散粉</a>
						<a href="#">口红</a>
						<a href="#">唇釉</a>
						<a href="#" class="last">眉笔</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>数码</p>
				</div>
				<div class="right">
					<p>
						<a href="#">笔记本</a>
						<a href="#">音箱</a>
						<a href="#">手表</a>
						<a href="#">平板</a>
						<a href="#" class="last">耳机</a>
					</p>
					<p>
						<a href="#">键盘</a>
						<a href="#">鼠标</a>
						<a href="#">路由器</a>
						<a href="#">手机壳</a>
						<a href="#" class="last">无人机</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>鞋靴</p>
				</div>
				<div class="right">
					<p>
						<a href="#">雪地靴</a>
						<a href="#">短靴</a>
						<a href="#">马丁靴</a>
						<a href="#">工装靴</a>
						<a href="#" class="last">流苏靴</a>
					</p>
					<p>
						<a href="#">袜靴</a>
						<a href="#">时装靴</a>
						<a href="#">西部靴</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">长靴</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>家清</p>
				</div>
				<div class="right">
					<p>
						<a href="#">抽纸</a>
						<a href="#">湿巾</a>
						<a href="#">洗衣液</a>
						<a href="#">洗洁精</a>
						<a href="#" class="last">柔顺剂</a>
					</p>
					<p>
						<a href="#">垃圾袋</a>
						<a href="#">沐浴球</a>
						<a href="#">洗发露</a>
						<a href="#">护发素</a>
						<a href="#" class="last">拖把</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>母婴</p>
				</div>
				<div class="right">
					<p>
						<a href="#">尿裤</a>
						<a href="#">奶粉</a>
						<a href="#">奶瓶</a>
						<a href="#">辅食</a>
						<a href="#" class="last">洗浴</a>
					</p>
					<p>
						<a href="#">玩具</a>
						<a href="#">驱蚊</a>
						<a href="#">清洁防护</a>
						<a href="#" class="last">婴幼餐具</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>护肤</p>
				</div>
				<div class="right">
					<p>
						<a href="#">爽肤水</a>
						<a href="#">乳液</a>
						<a href="#">精华</a>
						<a href="#">面膜</a>
						<a href="#" class="last">洁面</a>
					</p>
					<p>
						<a href="#">防晒</a>
						<a href="#">身体乳</a>
						<a href="#">衬衫</a>
						<a href="#">面霜</a>
						<a href="#" class="last">卸妆</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>宠物</p>
				</div>
				<div class="right">
					<p>
						<a href="#">猫主粮</a>
						<a href="#">狗主粮</a>
						<a href="#">猫零食</a>
						<a href="#" class="last">宠物美容</a>
					</p>
					<p>
						<a href="#">宠物保健</a>
						<a href="#">猫砂</a>
						<a href="#">清洁用品</a>
						<a href="#" class="last">餐具</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>粮油</p>
				</div>
				<div class="right">
					<p>
						<a href="#">食用油</a>
						<a href="#">大米</a>
						<a href="#">调味料</a>
						<a href="#">佐餐</a>
						<a href="#" class="last">五谷杂粮</a>
					</p>
					<p>
						<a href="#">面粉</a>
						<a href="#">面条</a>
						<a href="#">速食</a>
						<a href="#">烘焙</a>
						<a href="#" class="last">进口好货</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>休闲零食</p>
				</div>
				<div class="right">
					<p>
						<a href="#">糖果</a>
						<a href="#">巧克力</a>
						<a href="#">面包</a>
						<a href="#">糕点</a>
						<a href="#" class="last">坚果</a>
					</p>
					<p>
						<a href="#">饼干</a>
						<a href="#">蜜饯</a>
						<a href="#">肉干</a>
						<a href="#">膨化食品</a>
						<a href="#" class="last">辣条</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>女装</p>
				</div>
				<div class="right">
					<p>
						<a href="#">牛仔裤</a>
						<a href="#">休闲鞋</a>
						<a href="#">大码女装</a>
						<a href="#">毛衣</a>
						<a href="#" class="last">卫衣</a>
					</p>
					<p>
						<a href="#">T恤</a>
						<a href="#">连衣裙</a>
						<a href="#">吊带背心</a>
						<a href="#">短裙</a>
						<a href="#" class="last">开衫</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>家电</p>
				</div>
				<div class="right">
					<p>
						<a href="#">电视机</a>
						<a href="#">冰箱</a>
						<a href="#">洗衣机</a>
						<a href="#">洗碗机</a>
						<a href="#" class="last">吊灯</a>
					</p>
					<p>
						<a href="#">电饭煲</a>
						<a href="#">压力锅</a>
						<a href="#">微波炉</a>
						<a href="#">烤箱</a>
						<a href="#" class="last">水壶</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>
			<div class="list">
				<div class="left">
					<p>推荐</p>
				</div>
				<div class="right">
					<p>
						<a href="#">T恤</a>
						<a href="#">帆布鞋</a>
						<a href="#">POLO衫</a>
						<a href="#">牛仔裤</a>
						<a href="#" class="last">周大福</a>
					</p>
					<p>
						<a href="#">休闲裤</a>
						<a href="#">针织裤</a>
						<a href="#">衬衫</a>
						<a href="#">阿迪达斯</a>
						<a href="#" class="last">19元</a>
					</p>
				</div>
			</div>

		</div>
		
		<!-- 左侧结束 -->

		<!-- 右侧 -->
		<div class="news_tab">
			<ul class="tab_title">
				<li class="cur">最新动态</li>
				<li>积分反馈</li>
			</ul>
			<div class="con">
	    		<ul class="news_ul">
	    			<li><strong><a href="#">免运费政策调整通知</a></strong></li>
	    			<li><a href="#">满158元免运费</a><a href="#">配送延误通知</a></li>
	    			<li><a href="#">每日特惠9元起</a><a href="#">微信&飞侠商城</a></li>
	    			<li><a href="#">飞侠"赏春会"</a><a href="#">飞侠网站社区</a></li>
	    		</ul>
			</div>
			<div class="con" style="display:none;">
				<ul class="news_ul">
	    			<li><a href="#">积分商城</a></li>
	    			<li><a href="#">积分换礼</a></li>
	    			<li><a href="#">精品团购</a></li>
	    		</ul>
	    		<ul class="news_ul_r">
	    			<li><a href="#">积分当钱花</a></li>
	    			<li><a href="#">各种优惠随你享</a></li>
	    			<li><a href="#">0元赢好礼</a></li>
	    			<li><a href="#" style="color:#333;">飞侠生活，从10积分开始</a></li>
	    		</ul>
			</div>
		</div>
		<img :src="img.img1" class="right_img" />
		<img :src="img.img2" class="right_img" />
		<img :src="img.img3" class="right_img change_size" />
		<img :src="img.img4" class="right_img last_img change_size" />
		<!-- 右侧结束 -->
	</div>
	<!-- 所有商品分类区域结束 -->
<!-- 新品速递标题区域 -->
	<div class="xpsd_title">
		<a href="#" class="title">新品速递</a>
		 <div class="tags">
			<span>|</span>
            <a href="#" data-trigger="d0">男装</a>
            <a href="#" data-trigger="d1">女装</a>
            <a href="#" data-trigger="d2">童装</a>
            <a href="#" data-trigger="d3">运动</a>
            <a href="#" data-trigger="d4">配饰</a>
            <a href="#" data-trigger="d5">箱包</a>
            <a href="#" data-trigger="d6">家居</a> 			
		</div>		            
		<a href="#" class="read_more">查看更多</a>
	</div>
	<!-- 新品速递标题区域结束 -->
	<!-- 新品速递图片展示区域 -->
	<div id="cont">
	<table class="xpsd_img_table d0">
		<tr>
			<td rowspan="2"><img :src="xpsd.xpsd1" alt="" /></td>
			<td rowspan="2"><img :src="xpsd.xpsd2" alt="" /></td>
			<td rowspan="2"><img :src="xpsd.xpsd3" alt="" /></td>
			<td rowspan="2"><img :src="xpsd.xpsd4" alt="" /></td>
			<td><img :src="xpsd.xpsd5" alt="" /></td>
		</tr>
		<tr>
			<td><img :src="xpsd.xpsd6" alt="" /></td>
		</tr>
	</table>
	<table class="xpsd_img_table d1" style="display: none">
			<tr>
				<td rowspan="2"><img :src="cha.cha298_2" alt="" /></td>
				<td rowspan="2"><img :src="cha.cha199_1" alt="" /></td>
				<td rowspan="2"><img :src="cha.cha199_2" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd3" alt="" /></td>
				<td><img :src="xpsd.xpsd5" alt="" /></td>
			</tr>
			<tr>
				<td><img :src="xpsd.xpsd6" alt="" /></td>
			</tr>
	</table>
	<table class="xpsd_img_table d2" style="display: none">
			<tr>
				<td rowspan="2"><img :src="cha.cha298_1" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd3" alt="" /></td>
				<td rowspan="2"><img :src="cha.cha199_2" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd4" alt="" /></td>
				<td><img :src="xpsd.xpsd5" alt="" /></td>
			</tr>
			<tr>
				<td><img :src="xpsd.xpsd6" alt="" /></td>
			</tr>
	</table>
	<table class="xpsd_img_table d3" style="display: none">
			<tr>
				<td rowspan="2"><img :src="xpsd.xpsd1" alt="" /></td>
				<td rowspan="2"><img :src="cha.cha199_2" alt="" /></td>
				<td rowspan="2"><img :src="cha.cha199_1" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd4" alt="" /></td>
				<td><img :src="xpsd.xpsd5" alt="" /></td>
			</tr>
			<tr>
				<td><img :src="xpsd.xpsd6" alt="" /></td>
			</tr>
	</table>
	<table class="xpsd_img_table d4" style="display: none">
			<tr>
				<td rowspan="2"><img :src="cha.cha298_1" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd2" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd4" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd3" alt="" /></td>
				<td><img :src="xpsd.xpsd5" alt="" /></td>
			</tr>
			<tr>
				<td><img :src="xpsd.xpsd6" alt="" /></td>
			</tr>
	</table>
	<table class="xpsd_img_table d5" style="display: none">
			<tr>
				<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd3" alt="" /></td>
				<td rowspan="2"><img :src="cha.cha199_1" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd4" alt="" /></td>
				<td><img :src="xpsd.xpsd5" alt="" /></td>
			</tr>
			<tr>
				<td><img :src="xpsd.xpsd6" alt="" /></td>
			</tr>
	</table>
	<table class="xpsd_img_table d6" style="display: none">
			<tr>
				<td rowspan="2"><img :src="xpsd.xpsd1" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd3" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd4" alt="" /></td>
				<td rowspan="2"><img :src="cha.cha199_2" alt="" /></td>
				<td><img :src="xpsd.xpsd5" alt="" /></td>
			</tr>
			<tr>
				<td><img :src="xpsd.xpsd6" alt="" /></td>
			</tr>
	</table>
	
</div>
	<!-- 新品速递图片展示区域结束 -->

	<!-- 超值特惠速递标题区域 -->
	<div class="xpsd_title">
		<a href="#" class="title">超值特惠</a>
		<p class="tags">
			<span>|</span>
			<a href="#" data-trigger="e0">男装</a>
			<a href="#" data-trigger="e1">女装</a>
			<a href="#" data-trigger="e2">鞋</a>
			<a href="#" data-trigger="e3">童装</a>
			<a href="#" data-trigger="e4">运动</a>
			<a href="#" data-trigger="e5">配饰</a>
			<a href="#" data-trigger="e6">首饰</a>
			<a href="#" data-trigger="e7">箱包</a>
			<a href="#" data-trigger="e8">家居</a>
			<a href="#" data-trigger="e9">化妆品</a>
	
		</p>
		<a href="#" class="read_more">查看更多</a>
	</div>
	<!-- 超值特惠标题区域结束 -->
	<!-- 超值特惠图片展示区域开始 -->
	<div class="cont">
	<table class="xpsd_img_table e0">
		<tr>
			<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
			<td><img :src="czth.czth2" alt="" /></td>
			<td><img :src="czth.czth3" alt="" /></td>
			<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
			<td><img :src="czth.czth5" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="czth.czth7" alt="" /></td>
			<td><img :src="czth.czth6" alt="" /></td>
		</tr>
	</table>
	<table class="xpsd_img_table e1" style="display: none">
			<tr>
				<td rowspan="2"><img :src="cha.cha298_1" alt="" /></td>
				<td><img :src="cha.cha200-1" alt="" /></td>
				<td><img :src="cha.cha200_2" alt="" /></td>
				<td rowspan="2"><img :src="xpsd.xpsd3" alt="" /></td>
				<td><img :src="czth.czth2" alt="" /></td>
			</tr>
			<tr>
				<td colspan="2"><img :src="czth.czth7" alt="" /></td>
				<td><img :src="czth.czth6" alt="" /></td>
			</tr>
		</table>
		<table class="xpsd_img_table e2" style="display: none">
				<tr>
					<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
					<td><img :src="czth.czth2" alt="" /></td>
					<td><img :src="cha.cha200_3" alt="" /></td>
					<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
					<td><img :src="czth.czth5" alt="" /></td>
				</tr>
				<tr>
					<td colspan="2"><img :src="czth.czth7" alt="" /></td>
					<td><img :src="czth.czth6" alt="" /></td>
				</tr>
			</table>
			<table class="xpsd_img_table e3" style="display: none">
					<tr>
						<td rowspan="2"><img :src="xpsd.xpsd1" alt="" /></td>
						<td><img :src="cha.cha200_4" alt="" /></td>
						<td><img :src="czth.czth2" alt="" /></td>
						<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
						<td><img :src="czth.czth6" alt="" /></td>
					</tr>
					<tr>
						<td colspan="2"><img :src="czth.czth7" alt="" /></td>
						<td><img :src="czth.czth5" alt="" /></td>
					</tr>
				</table>
				<table class="xpsd_img_table e4" style="display: none">
					<tr>
					<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
					<td><img :src="czth.czth5" alt="" /></td>
					<td><img :src="czth.czth6" alt="" /></td>
					<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
					<td><img :src="czth.czth5" alt="" /></td>
				</tr>
				<tr>
				<td colspan="2"><img :src="czth.czth7" alt="" /></td>
				<td><img :src="czth.czth6" alt="" /></td>
			</tr>
		</table>
		<table class="xpsd_img_table e5" style="display: none">
			<tr>
			<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
			<td><img :src="czth.czth6" alt="" /></td>
			<td><img :src="czth.czth2" alt="" /></td>
			<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
			<td><img :src="czth.czth5" alt="" /></td>
		</tr>
		<tr>
		<td colspan="2"><img :src="czth.czth7" alt="" /></td>
		<td><img :src="czth.czth6" alt="" /></td>
	</tr>
</table>
		<table class="xpsd_img_table e6" style="display: none">
				<tr>
					<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
					<td><img :src="czth.czth2" alt="" /></td>
					<td><img :src="czth.czth6" alt="" /></td>
					<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
					<td><img :src="czth.czth5" alt="" /></td>
				</tr>
				<tr>
					<td colspan="2"><img :src="czth.czth7" alt="" /></td>
					<td><img :src="czth.czth6" alt="" /></td>
				</tr>
		</table>
		<table class="xpsd_img_table e7" style="display: none">
				<tr>
					<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
					<td><img :src="czth.czth2" alt="" /></td>
					<td><img :src="czth.czth3" alt="" /></td>
					<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
					<td><img :src="czth.czth5" alt="" /></td>
				</tr>
				<tr>
					<td colspan="2"><img :src="czth.czth7" alt="" /></td>
					<td><img :src="czth.czth6" alt="" /></td>
				</tr>
		</table>
		<table class="xpsd_img_table e8" style="display: none">
				<tr>
					<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
					<td><img :src="czth.czth2" alt="" /></td>
					<td><img :src="cha.cha200_7" alt="" /></td>
					<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
					<td><img :src="czth.czth5" alt="" /></td>
				</tr>
				<tr>
					<td colspan="2"><img :src="czth.czth7" alt="" /></td>
					<td><img :src="cha.cha200_8" alt="" /></td>
				</tr>
		</table>
		<table class="xpsd_img_table e9" style="display: none">
				<tr>
					<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
					<td><img :src="czth.czth6" alt="" /></td>
					<td><img :src="cha.cha200_9" alt="" /></td>
					<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
					<td><img :src="czth.czth5" alt="" /></td>
				</tr>
				<tr>
					<td colspan="2"><img :src="czth.czth7" alt="" /></td>
					<td><img :src="czth.czth2" alt="" /></td>
				</tr>
		</table>
	</div>
	<!-- 超值特惠图片展示区域结束 -->
    <!-- 当季推荐速递标题区域 -->
	<div class="xpsd_title">
		<a href="#" class="title">当季推荐</a>
		<p class="tags djtui">
			<span>|</span>
			<a href="#" data-trigger="f0">男装</a>							
			<a href="#" data-trigger="f1">女装</a>		
			<a href="#" data-trigger="f2">鞋</a>
			<a href="#" data-trigger="f3">童装</a>
			<a href="#" data-trigger="f4">运动</a>
			<a href="#" data-trigger="f5">配饰</a>
			<a href="#" data-trigger="f6">首饰</a>
			<a href="#" data-trigger="f7">箱包</a>
			<a href="#" data-trigger="f8">家居</a>
			<a href="#" data-trigger="f9">化妆品</a>
		</p>
		<a href="#" class="read_more">查看更多</a>
	</div>
	<!-- 当季推荐标题区域结束 -->
	<!-- 当季推荐图片展示区域结束 -->
	<div>
	<table class="xpsd_img_table f0 ">
		<tr>
			<td rowspan="2"><img :src="djtj.djtj1" alt="" /></td>
			<td><img :src="djtj.djtj2" alt="" /></td>
			<td><img :src="djtj.djtj3" alt="" /></td>
			<td rowspan="2"><img :src="djtj.djtj4" alt="" /></td>
			<td><img :src="djtj.djtj5" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="djtj.djtj7" alt="" /></td>
			<td><img :src="djtj.djtj6" alt="" /></td>
		</tr>
	</table>
	<table class="xpsd_img_table f1 " style="display: none">
		<tr>
			<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
			<td><img :src="czth.czth2" alt="" /></td>
			<td><img :src="czth.czth3" alt="" /></td>
			<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
			<td><img :src="czth.czth5" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="djtj.djtj7" alt="" /></td>
			<td><img :src="djtj.djtj6" alt="" /></td>
		</tr>
	</table>
    <table class="xpsd_img_table f2 " style="display: none">
		<tr>
			<td rowspan="2"><img :src="xpsd.xpsd1" alt="" /></td>
			<td><img :src="xpsd.xpsd6" alt="" /></td>
			<td><img :src="djtj.djtj3" alt="" /></td>
			<td rowspan="2"><img :src="djtj.djtj4" alt="" /></td>
			<td><img :src="djtj.djtj5" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="djtj.djtj7" alt="" /></td>
			<td><img :src="djtj.djtj6" alt="" /></td>
		</tr>
	</table>
	<table class="xpsd_img_table f3 " style="display: none">
		<tr>
			<td rowspan="2"><img :src="djtj.djtj1" alt="" /></td>
			<td><img :src="djtj.djtj2" alt="" /></td>
			<td><img :src="djtj.djtj3" alt="" /></td>
			<td rowspan="2"><img :src="djtj.djtj4" alt="" /></td>
			<td><img :src="djtj.djtj5" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="djtj.djtj7" alt="" /></td>
			<td><img :src="djtj.djtj6" alt="" /></td>
		</tr>
	</table>
    <table class="xpsd_img_table f4 " style="display: none">
		<tr>
			<td rowspan="2"><img :src="cha.cha298_1" alt="" /></td>
			<td><img :src="cha.cha200_9" alt="" /></td>
			<td><img :src="cha.cha200_8" alt="" /></td>
			<td rowspan="2"><img :src="cha.cha199_1" alt="" /></td>
			<td><img :src="djtj.djtj5" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="djtj.djtj7" alt="" /></td>
			<td><img :src="djtj.djtj6" alt="" /></td>
		</tr>
	</table>
    <table class="xpsd_img_table f5 " style="display: none">
		<tr>
			<td rowspan="2"><img :src="djtj.djtj1" alt="" /></td>
			<td><img :src="djtj.djtj2" alt="" /></td>
			<td><img :src="djtj.djtj3" alt="" /></td>
			<td rowspan="2"><img :src="djtj.djtj4" alt="" /></td>
			<td><img :src="djtj.djtj5" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="djtj.djtj7" alt="" /></td>
			<td><img :src="djtj.djtj6" alt="" /></td>
		</tr>
	</table>
	<table class="xpsd_img_table f6 " style="display: none">
		<tr>
			<td rowspan="2"><img :src="czth.czth1" alt="" /></td>
			<td><img :src="czth.czth2" alt="" /></td>
			<td><img :src="czth.czth3" alt="" /></td>
			<td rowspan="2"><img :src="czth.czth4" alt="" /></td>
			<td><img :src="czth.czth5" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="djtj.djtj7" alt="" /></td>
			<td><img :src="djtj.djtj6" alt="" /></td>
		</tr>
	</table>
    <table class="xpsd_img_table f7 " style="display: none">
		<tr>
			<td rowspan="2"><img :src="djtj.djtj1" alt="" /></td>
			<td><img :src="djtj.djtj2" alt="" /></td>
			<td><img :src="djtj.djtj3" alt="" /></td>
			<td rowspan="2"><img :src="djtj.djtj4" alt="" /></td>
			<td><img :src="djtj.djtj5" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="djtj.djtj7" alt="" /></td>
			<td><img :src="djtj.djtj6" alt="" /></td>
		</tr>
	</table>
    <table class="xpsd_img_table f8 " style="display: none">
		<tr>
			<td rowspan="2"><img :src="xpsd.xpsd1" alt="" /></td>
			<td><img :src="cha.cha200_10" alt="" /></td>
			<td><img :src="cha.cha200_11" alt="" /></td>
			<td rowspan="2"><img :src="djtj.djtj4" alt="" /></td>
			<td><img :src="cha.cha200_14" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="djtj.djtj7" alt="" /></td>
			<td><img :src="cha.cha200_18" alt="" /></td>
		</tr>
	</table>
	<table class="xpsd_img_table f9 " style="display: none">
		<tr>
			<td rowspan="2"><img :src="djtj.djtj1" alt="" /></td>
			<td><img :src="djtj.djtj2" alt="" /></td>
			<td><img :src="djtj.djtj3" alt="" /></td>
			<td rowspan="2"><img :src="djtj.djtj4" alt="" /></td>
			<td><img :src="djtj.djtj5" alt="" /></td>
		</tr>
		<tr>
			<td colspan="2"><img :src="djtj.djtj7" alt="" /></td>
			<td><img :src="djtj.djtj6" alt="" /></td>
		</tr>
	</table>
	</div>
	<!-- 当季推荐图片展示区域结束 -->
    <!-- 凡客达人、我是凡客区域 -->
	<div class="daren_fanke">
		<div class="left">
			<!-- 当季推荐速递标题区域 -->
			<div class="xpsd_title">
				<a href="#" class="title">啵啵达人</a>
				<a href="#" class="read_more">查看更多</a>
			</div>
			<!-- 当季推荐标题区域结束 -->
			<table class="xpsd_img_table">
				<tr>
					<td><img :src="fankedaren.fankedaren1" alt="" /></td>
					<td><img :src="fankedaren.fankedaren2" alt="" /></td>
					<td><img :src="fankedaren.fankedaren3" alt="" /></td>
				</tr>
			</table>
		</div>
		<div class="right">
			<!-- 当季推荐速递标题区域 -->
			<div class="xpsd_title">
				<a href="#" class="title">我是啵啵</a>
				<a href="#" class="read_more">查看更多</a>
			</div>
			<!-- 当季推荐标题区域结束 -->
			<table class="xpsd_img_table" style="float:left;">
				<tr>
					<td><img :src="img.nke" alt="" /></td>
				</tr>
			</table>
			<ul>
				<li><a href="#">POLO衫流行趋势</a></li>
				<li><a href="#">“微T”解析各地用户消费行为</a></li>
				<li><a href="#">8大城市“平底鞋指数”出炉</a></li>
				<li><a href="#">啵啵陈年：规模和盈利并重</a></li>
				<li><a href="#">新女性告别“恨天高”</a></li>
				<li><a href="#">啵啵：女性消费者占7成</a></li>
				<li><a href="#">释放与传统品牌共存信号</a></li>
				<li><a href="#">牵手鸟叔入华跨界品牌合作</a></li>
			</ul>
		</div>
	</div>
	<!-- 我是啵啵区域结束 -->

	<img :src="img._ad" id="senma_ad" />

	<!-- 底部区域 -->
		<div id="footer">
			<dl class="footer_list one">
				<dt><a href="#">关于啵啵</a></dt>
				<dd><a href="#">公司简介</a></dd>
				<dd><a href="#">加入啵啵</a></dd>
				<dd><a href="#">合作专区</a></dd>
				<dd><a href="#">联系我们</a></dd>
				<dd><a href="#">友情链接</a></dd>
			</dl>

			<dl class="footer_list two">
				<dt><a href="#">售后服务</a></dt>
				<dd><a href="#">退货政策</a></dd>
				<dd><a href="#">条款说明</a></dd>
				<dd><a href="#">办理退货</a></dd>
				<dd><a href="#">退货流程</a></dd>
				<dd><a href="#">常见售后问题</a></dd>
			</dl>

			<dl class="footer_list three">
				<dt><a href="#">账户管理</a></dt>
				<dd><a href="#">账户注册</a></dd>
				<dd><a href="#">找回密码</a></dd>
				<dd><a href="#">账户常见问题</a></dd>
				
			</dl>

			<dl class="footer_list four">
				<dt><a href="#">购物指南</a></dt>
				<dd><a href="#">服务条款</a></dd>
				<dd><a href="#">购物流程</a></dd>
				<dd><a href="#">会员制度</a></dd>
				<dd><a href="#">积分计划</a></dd>
				<dd><a href="#">取消订单</a></dd>
			</dl>

			<dl class="footer_list five">
				<dt><a href="#">配送方式</a></dt>
				<dd><a href="#">国际配送</a></dd>
				<dd><a href="#">国内配送</a></dd>
				<dd><a href="#">订单拆分</a></dd>
				<dd><a href="#">验货与签收</a></dd>
				<dd><a href="#">配送问题</a></dd>
			</dl>

			<dl class="footer_list six">
				<dt><a href="#">支付方式</a></dt>
				<dd><a href="#">在线支付</a></dd>
				<dd><a href="#">啵啵优惠券</a></dd>
				<dd><a href="#">虚拟账户支付</a></dd>
				<dd><a href="#">发票制度</a></dd>
				<dd><a href="#">支付问题</a></dd>
			</dl>

			<div class="tel">
				<p class="cn">订购热线<span>(仅收市话费)</span></p>
				<p class="tel_num">400-600-6888</p>
				<p class="cn">客户服务热线<span>(仅收市话费)</span></p>
				<p class="tel_num">400-650-7099</p>
			</div>

			<div class="bottom_four">
				<a href="#"><span class="one"></span></a>
				<a href="#"><span class="two"></span></a>
				<a href="#"><span class="three"></span></a>
				<a href="#"><span class="four"></span></a>
			</div>
		</div>
	<!-- 底部区域结束 -->
	<p class="bottom_copy">Copyright 2007 - 2013 vancl.com All Rights Reserved 京ICP证100557号 京公网安备11010102000579号 出版物经营许可证新出发京批字第直110138号</p>
	<div id="bottom_img">
		<a href="#" class="one"></a>
		<a href="#" class="two"></a>
		<a href="#" class="three"></a>
		<a href="#" class="four"></a>
	</div>    
    </div>
</div>

</template>
<script>
import "../assets/ToolFile/style.css"
import $ from 'jquery';
export default {
	name: 'Home',
    data() {
        return {
		uname:"",
          img:{
            adi1:require("../assets/images/ad1.png"),
            img1:require("../assets/images/1.jpg"),
            img2:require("../assets/images/2.jpg"),
            img3:require("../assets/images/3.jpg"),
            img4:require("../assets/images/4.jpg"),
            ren:require("../assets/images/fankedaren.jpg"),
            xia:require("../assets/images/fankeqixia.jpg"),
            _ad:require("../assets/images/senma-ad.jpg"),
            sbg:require("../assets/images/spritesbg.png"),
            con:require("../assets/images/spritesbgcon.png"),
            _bg:require("../assets/images/top_bg.jpg"),
            nke:require("../assets/images/woshifanke.jpg"),
          },
          box_left:{
            left1:require("../assets/images/flash_box_left/1.jpg"),
            left2:require("../assets/images/flash_box_left/2.jpg"),
            left3:require("../assets/images/flash_box_left/3.jpg"),
            left4:require("../assets/images/flash_box_left/4.jpg"),
            left5:require("../assets/images/flash_box_left/5.jpg"),
          },
          flash:{
             flash1:require("../assets/images/flash/1.jpg"),
             flash2:require("../assets/images/flash/2.jpg"),
             flash3:require("../assets/images/flash/3.jpg"),
             flash4:require("../assets/images/flash/4.jpg"),
             flash5:require("../assets/images/flash/5.jpg"),
             flash6:require("../assets/images/flash/6.jpg"),
             flash7:require("../assets/images/flash/7.jpg"),
          },
          cha:{
              cha198_1:require("../assets/images/cha/198+168-1.jpg"),
              cha199_1:require("../assets/images/cha/199+408-1.jpg"),
              cha199_2:require("../assets/images/cha/199+408-2.jpg"),
              cha200_1:require("../assets/images/cha/200-1.jpg"),
              cha200_2:require("../assets/images/cha/200-2.jpg"),
              cha200_3:require("../assets/images/cha/200-3.jpg"),
              cha200_4:require("../assets/images/cha/200-4.jpg"),
              cha200_5:require("../assets/images/cha/200-5.jpg"),
              cha200_6:require("../assets/images/cha/200-6.jpg"),
              cha200_7:require("../assets/images/cha/200-7.jpg"),
              cha200_8:require("../assets/images/cha/200-8.jpg"),
              cha200_9:require("../assets/images/cha/200-9.jpg"),
              cha200_10:require("../assets/images/cha/200-10.jpg"),
              cha200_11:require("../assets/images/cha/200-11.png"),
              cha200_12:require("../assets/images/cha/200-12.jpg"),
              cha200_13:require("../assets/images/cha/200-13.jpg"),
              cha200_14:require("../assets/images/cha/200-14.jpg"),
              cha200_15:require("../assets/images/cha/200-15.jpg"),
              cha200_16:require("../assets/images/cha/200-16.png"),
              cha200_17:require("../assets/images/cha/200-17.jpg"),
              cha200_18:require("../assets/images/cha/200-18.jpg"),
              cha298_1:require("../assets/images/cha/298+408-1.jpg"),
              cha298_2:require("../assets/images/cha/298+408-2.jpg"),
              cha385:require("../assets/images/cha/385-275.jpg"),
              cha863:require("../assets/images/cha/6139863-1j201710131550493576.jpg"),
              cha266:require("../assets/images/cha/6375266-1j201709260833244350.jpg"),
              cha696:require("../assets/images/cha/6375696-1j201703291510571510.jpg"),
              cha697:require("../assets/images/cha/6375697-1j201703291510571510.jpg"),
              cha470:require("../assets/images/cha/6379470-1j201804131731055283.jpg"),
              cha500:require("../assets/images/cha/6379500-1j201810191113348773.jpg"),
              chab8:require("../assets/images/cha/b8087b6c02ce98c77101b91fe7ff8011.jpg"),
              chac7:require("../assets/images/cha/c7a3442ce804641ca9e7ee1af5f8da80.jpg"),
              chae0:require("../assets/images/cha/e00243bce067ff5cf2a22574185135d5.jpeg"),
              chaff:require("../assets/images/cha/ffe82507dff7ef20ab1f88ea0f18a774.jpg"),
              chajj:require("../assets/images/cha/jj.jpg")
          },
          czth:{
              czth1:require("../assets/images/czth/1.jpg"),
              czth2:require("../assets/images/czth/2.jpg"),
              czth3:require("../assets/images/czth/3.jpg"),
              czth4:require("../assets/images/czth/4.jpg"),
              czth5:require("../assets/images/czth/5.jpg"),
              czth6:require("../assets/images/czth/6.jpg"),
              czth7:require("../assets/images/czth/7.jpg"),
          },
          djtj:{
             djtj1:require("../assets/images/djtj/1.jpg"),
             djtj2:require("../assets/images/djtj/2.jpg"),
             djtj3:require("../assets/images/djtj/3.jpg"),
             djtj4:require("../assets/images/djtj/4.jpg"),
             djtj5:require("../assets/images/djtj/5.jpg"),
             djtj6:require("../assets/images/djtj/6.jpg"),
             djtj7:require("../assets/images/djtj/7.jpg"),
          },
          fankedaren:{
              fankedaren1:require("../assets/images/fankedaren/1.jpg"),
              fankedaren2:require("../assets/images/fankedaren/2.jpg"),
              fankedaren3:require("../assets/images/fankedaren/3.jpg"),
          },
          xpsd:{
            xpsd1:require("../assets/images/xpsd/1.jpg"),
            xpsd2:require("../assets/images/xpsd/2.jpg"),
            xpsd3:require("../assets/images/xpsd/3.jpg"),
            xpsd4:require("../assets/images/xpsd/4.jpg"),
            xpsd5:require("../assets/images/xpsd/5.jpg"),
            xpsd6:require("../assets/images/xpsd/6.jpg"),
          }
        }
    },
    mounted () {
		this.uname=this.$route.params.uname
    // 顶部菜单效果
    $(function(){
        $('#top_bg #top #top_right li.has_hide').hover(function(){
		$(this).addClass('cur');
		$(this).find('.menu_a').addClass('cur');
		$(this).find('.hide_box').show();
	},function(){
		$(this).removeClass('cur');
		$(this).find('.menu_a').removeClass('cur');
		$(this).find('.hide_box').hide();
    })
    // 啵啵诚品和v+商城点击切换效果
	$('#main #logo_box #on_search li').click(function(){
		$(this).removeClass('no_bg').siblings().addClass('no_bg');
    })
    $('#main #logo_box #gouwuche').hover(function(){
		$(this).addClass('cur');
		$(this).find('.hide_box').show();
	},function(){
		$(this).removeClass('cur');
		$(this).find('.hide_box').hide();
    })
    // 啵啵诚品旗下网站
	$('#main #logo_box #fankeqixia_box .fankeqixia').mouseover(function(){
		$(this).addClass('cur');//给当前元素加cur class属性
		$(this).siblings('.hide_box').show();
	})
	$('#main #logo_box #fankeqixia_box .fankeqixia').mouseout(function(){
		$(this).removeClass('cur');//给当前元素加cur class属性
		$(this).siblings('.hide_box').hide();
	})
	$('#main #logo_box #fankeqixia_box .hide_box').mouseover(function(){
		$(this).siblings('.fankeqixia').addClass('cur');//给当前元素加cur class属性
		$(this).show();
	})
	$('#main #logo_box #fankeqixia_box .hide_box').mouseout(function(){
		$(this).siblings('.fankeqixia').removeClass('cur');//给当前元素加cur class属性
		$(this).hide();
	})
    // 灰色导航条区域
	$('#main #menu2_box .menu2_left .list').mouseover(function(){//鼠标移入时的事件
		$(this).find('.list_a').addClass('cur');//让当前li里面的a标签加一个cur class
		$(this).find('.hide_box').show();//让当前li里面的隐藏区域显示出来
	})
	$('#main #menu2_box .menu2_left .list').mouseout(function(){//鼠标移出时的事件
		$(this).find('.list_a').removeClass('cur');//移除cur class
		$(this).find('.hide_box').hide();//让当前li里面的隐藏区域隐藏
	})
    // 图片轮换板效果
	    var flash_sta = 0;
	    var timer = setInterval(autoRun,1000);
	    function autoRun(){//控制自动轮播的函数
		    flash_sta++;
		// if(flash_sta==7){
		// 	flash_sta = 0;
		// }
		flash_sta = (flash_sta==7)?0:flash_sta;//判断flash_sta值是否到最后，到最后的话就切为0;
		$('.flash img').eq(flash_sta).fadeIn().siblings('img').hide();//让对应的图片显示，让兄弟图片隐藏
		$('.flash ul li').eq(flash_sta).addClass('cur').siblings('li').removeClass('cur');//控制li的样式
	}

	$('.flash ul li').mouseover(function(){//鼠标移入事件
		clearInterval(timer);
		flash_sta = $(this).index();//获得鼠标移入到了第几个li里
		$('.flash img').eq(flash_sta).fadeIn().siblings('img').hide();//让对应的图片显示，让兄弟图片隐藏
		$('.flash ul li').eq(flash_sta).addClass('cur').siblings('li').removeClass('cur');//控制li的样式
	})
	$('.flash ul li').mouseout(function(){//鼠标移出效果
		timer = setInterval(autoRun,1000);
	})
	//无缝滚动效果
	var ul_width = 0;
	$('.wufeng .wufeng_right ul.list1 li').each(function(){
		ul_width = ul_width + $(this).width();//计算ul的宽度
	})
	$('.wufeng .wufeng_right ul').css('width',ul_width+'px');//将宽度加到ul上面
	$('.wufeng .wufeng_right ul.list2').css('left',ul_width+'px');//给第二个ul设置left值

	var change_left = 710 - ul_width*2;
	function wufeng(obj){
		setInterval(function(){
			var old_left = obj.position().left;//获得obj现有的left
			var new_left = old_left - 1;
			if(new_left<change_left){
				obj.css('left','710px');
				new_left = 710;
			}
			obj.css('left',new_left+'px');
		},20)
	}
	wufeng($('.wufeng .wufeng_right ul.list1'))
    wufeng($('.wufeng .wufeng_right ul.list2'))
    
    //所有商品分类效果
	$('#main #fenlei_box .fenlei_list .list').mouseover(function(){
		$(this).find('.left').addClass('l_cur');
		$(this).find('.right').addClass('r_cur');
	})
	$('#main #fenlei_box .fenlei_list .list').mouseout(function(){
		$(this).find('.left').removeClass('l_cur');
		$(this).find('.right').removeClass('r_cur');
    })
    // tab切换页效果
	$('#main #fenlei_box .news_tab .tab_title li').mouseover(function(){
		$(this).addClass('cur').siblings().removeClass('cur');
		var cur = $(this).index();
		$('#main #fenlei_box .news_tab .con').eq(cur).show().siblings('.con').hide();
	})
	
	$('#tab').on('click','li>a',function(e){
		e.preventDefault();
		var bu=e.target;
		$(`.${$(bu).data('trigger')}`).show().siblings().hide();
	})
	
	$('.tags').on('click','a',function(e){
		e.preventDefault();
		var be=e.target;
		$(`.${$(be).data('trigger')}`).show().siblings().hide();
    })
    $('.djtui').on('click','a',function(e){
		e.preventDefault();
		var fe=e.target;
		$(`.${$(fe).data('trigger')}`).show().siblings().hide();
	})
    })
    }
}
</script>
<style scoped>
   a{   
       color: black;
   } 
</style>